<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">

<title>施工单位 详细</title>
<link rel="stylesheet" href="css/vivo.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="js/bootstrap2/css/bootstrap.min.css">
<link rel="stylesheet" href="js/bootstrap2/css/bootstrap-table.css">
<link rel="stylesheet" href="css/common.css">
<link href="js/select2/select2.min.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="js/webuploader-0.1.5/webuploader.css" />

<script src="js/jquery-1.11.1.js"></script>
<script src="js/bootstrap2/js/bootstrap.min.js"></script>

<script src="js/bootstrap2/js/bootstrap-table.js"></script>
<script src="js/bootstrap2/js/bootstrap-table-zh-CN.js"></script>
<script src="js/select2/select2.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/My97DatePicker/WdatePicker.js"></script> 
<script type="text/javascript" src="js/webuploader-0.1.5/webuploader.js"></script>
<script type="text/javascript" src="js/layui-v2.1.5/layui/layui.all.js"></script> 
<script type="text/javascript" src="js/sharefunction.js"></script> 
<script type="text/javascript" src="js/form.js"></script> 
<!-- 图片放大 -->
<script src="js/postbird-img-glass/postbird-img-glass.js" ></script>
<style type="text/css">
	/* 上传按钮与文本框对其 */
	div[id^='filePicker']{
		vertical-align:middle;
	}
</style>
</head>
<!-- 施工单位 -->
<body>
<div>
	<!-- 表单开始 -->
	<form id="roadworkForm" action="customer/dm/addRoadWork" method="post" onsubmit="return false;" >
		<input type="hidden" id="roadwork_articleId">
		<div class="panel panel-default">
			<div class="panel-body ">
				<table cellpadding="10" cellspacing="5" class="mytable">
					<tr>
						<td width="90"><span class="style_btn">施工方案</span></td>
						<td>
							<select id="roadwork_s2" style="width: 200px;" ></select>
						</td>
					</tr>
					<tr>
						<td width="90"><span class="style_btn">企业名称</span></td>
						<td><input name="unitName"  /></td>
					</tr>
					<tr>
						<td><span class="style_btn">企业证件</span></td>
						<td><input name="unitCa"  /></td>
					</tr>
					<!-- 企业证件附件 -->
					<tr>
						<td></td>
						<td>
							<!-- 缩略图容器 -->
							<div id='list_unitCa'></div> <!-- 上传按钮 -->
							<div id='filePicker_unitCa' style="display: none;">上传</div>
						</td>
					</tr>
					<tr>
						<td><span class="style_btn">施工资质</span></td>
						<td>
							<!-- 缩略图容器 -->
							<div id='list_workAptitude'></div> <!-- 上传按钮 -->
							<div id='filePicker_workAptitude' style="display: none;">上传</div>
						</td>
					</tr>
					<tr>
						<td><span class="style_btn">授权委托</span></td>
						<td>
							<!-- 缩略图容器 -->
							<div id='list_authorize'></div> <!-- 上传按钮 -->
							<div id='filePicker_authorize' style="display: none;">上传</div>
						</td>
					</tr>
					<tr>
						<td><span class="style_btn">相关保险</span></td>
						<td>
							<!-- 缩略图容器 -->
							<div id='list_insurance'></div> <!-- 上传按钮 -->
							<div id='filePicker_insurance' style="display: none;">上传</div>
						</td>
					</tr>
					<tr>
						<td><span class="style_btn">人员清册</span></td>
						<td>
							<!-- 缩略图容器 -->
							<div id='list_staffList'></div> <!-- 上传按钮 -->
							<div id='filePicker_staffList' style="display: none;">上传</div>
						</td>
					</tr>
				</table>
				<!-- 修改时添加变更说明 -->
			<div style="margin:10px;display:none;" id="rw_div">
				变更说明<textarea rows="3" name="remark" id="rwRemark" style="width:70%"></textarea><span style="color:red;">*</span>
			</div>
			</div>
		</div>
		<input name="roadworkId" id="entityId_id" value="${id }" hidden="hidden"/>
		<div id="roadworkSubmit" style="width:100%;text-align:center; padding-top:20px">
			
			<br/>
		</div>
	</form>
	<div style="display: none;" >
		<!-- <button class="btn btn-danger radius" id="roadworkEdit" onclick="roadworkEditForm(this);" type="button">启用编辑</button> -->
		<button class="btn btn-danger radius" id="roadworkTijiao" onclick="roadworkSave1(this);" type="button">提交</button>
		<button class="btn btn-danger radius" id="roadworkSave" style="margin-left: 10px;" onclick="roadworkSave1(this);" type="button" >保存</button>
		<a class="btn btn-default radius" id="roadworkReset" style="margin-left: 10px;" onclick="resetForms('roadworkForm');">重置</a> <br />
	</div>
	<!-- 表单结束 -->
	<!-- 施工单位js -->
	<script type="text/javascript">
		var roadFuidList = new Array();//删除附件id的集合
		var roadWorkopt=0;//0 ：保存 1：提交 2：修改
		var fkcustomerId = parent.fkcustomerId;
		var fkroomId = parent.fkroomId;
		$(function(){
			if(roadWorkFlag == "2"){
				$("#rw_div").show();
			}
			initRoadWorkFiles();
			//初始化表单
			mySubmit("roadworkForm", initRoadWorkData, dRoadSchemeDataSuccess);
			//初始化select2 插件
			initS2();
			//初始化各个上传插件
			//参数说明：上传按钮id、缩略图容器id、物件id、存放上传文件信息隐藏域id、成功回调、失败回调
			initWebUpload("filePicker_unitCa", "list_unitCa", "企业证件", "roadwork_articleId",decorationManageUpSccess,undefined,null);
			initWebUpload("filePicker_workAptitude", "list_workAptitude", "施工资质", "roadwork_articleId",decorationManageUpSccess,undefined,null);
			initWebUpload("filePicker_authorize", "list_authorize", "授权委托", "roadwork_articleId",decorationManageUpSccess,undefined,null);
			initWebUpload("filePicker_insurance", "list_insurance", "相关保险", "roadwork_articleId",decorationManageUpSccess,undefined,null);
			initWebUpload("filePicker_staffList", "list_staffList", "人员清册", "roadwork_articleId",decorationManageUpSccess,undefined,null);
			//当刚开始这个div没有被展示 display=none时 这个div的宽高会为0，导致不能点击，所以要手动设置高度
			$("div[id^=filePicker] div").css({"width":"60px","height":"30px"});
		});
	//添加图片
	function initRoadWorkFiles(){
		var roadworkId= $("#roadworkForm [name='roadworkId']").val();
		getFileList(roadworkId,"施工资质","#list_workAptitude",setRoadRFL,imgPlus);
		getFileList(roadworkId,"企业证件","#list_unitCa",setRoadRFL,imgPlus);
		getFileList(roadworkId,"授权委托","#list_authorize",setRoadRFL,imgPlus);
		getFileList(roadworkId,"相关保险","#list_insurance",setRoadRFL,imgPlus);
		getFileList(roadworkId,"人员清册","#list_staffList",setRoadRFL,imgPlus);
	}
	
	function decorationManageUpSccess(file,data){
		successImg(file.id);
		
	}
	
	function initS2(){
		var $s2=$("#roadwork_s2");
		//获取该客户下的所有施工单位
		$.getJSON("customer/dm/getAllDecorateScheme",{
			fkcustomerId:fkcustomerId,
			roomId:fkroomId,
		},function(data,status){
			if(data != null){
				var t=$s2.select2();
				$s2.find("*").remove();
				$s2.append("<option value=\"\">请选择装修方案</option>");
				$s2.val("").trigger("change");
				$.each(data,function(i,v){
					$s2.append("<option value="+v.id+">"+v.schemeName+"</option>");
				});
				//初始化表单数据,由于需要给select2，所以要在s2加载完成之后初始化表单数据
				initRoadWorkForm($s2);
			}
		});
		//s2 change事件,修改装修方案全局id变量
		$s2.change(function(){
			fkdschemeId=$s2.val();
		});
	}
	var roadWorkFlag = '${roadWorkFlag}';//查看、编辑状态
	//初始化表单数据，如果有数据直接带入到页面中(该方法在初始化s2之后执行的)
	function initRoadWorkForm(s2){
		var roadworkId= $("#roadworkForm [name='roadworkId']").val();
		if(roadworkId == "" || roadworkId==null || roadworkId==undefined){
			//添加提交保存按钮
			$("#roadworkSubmit").prepend($("#roadworkReset"));
			$("#roadworkSubmit").prepend($("#roadworkSave"));
			$("#roadworkSubmit").prepend($("#roadworkTijiao"));
			$("#roadworkForm div[id^='filePicker']").css("display","inline-block");
		}else{
			$.getJSON("customer/dm/getRoadworkAddById",{
				id : roadworkId
			},function(data){
				//data=data[0];
				if(data!=null){
					//添加编辑按钮
					//$("#roadworkSubmit").prepend($("#roadworkEdit"));
					//操作字段改为修改状态
					roadWorkopt=2;
					//本页面id属性赋值
					$("input[name='unitName']").val(data.unitName);
					$("input[name='unitCa']").val(data.unitCa);
					s2.val(data.fkdschemeId).trigger("change");
					
					if(roadWorkFlag == "1"){//查看
						//锁定表单
						$("#roadworkForm input").attr("readonly",true);
						$("#roadworkForm select").attr("disabled",true);
						//禁止点击上传按钮
						$("#roadworkForm div[id^='filePicker']").hide();
					}else{
						//添加保存按钮 重置按钮
						$("#roadworkSubmit").prepend($("#roadworkReset"));
						$("#roadworkSubmit").prepend($("#roadworkSave"));
						$("#roadworkForm .uploadcancel").show();
						$("#roadworkForm div[id^='filePicker']").css("display","inline-block");
					}
					
				}
			});
		}
	}
	//本页面图片放大通用方法,同时隐藏上传按钮与图片删除按钮
	function imgPlus(data){
		$.each(data,function(i,v){
			hideFileBtn(v.id);
			PostbirdImgGlass.init({
		    	domSelector:"#"+v.id+" img",
		    	animation:true,
		    	//height:'80%',
		    	myDocument:window.parent.parent.parent
			});
		});
	}
	//隐藏附件删除按钮
	function hideFileBtn(id){
		$("#"+id+" span.uploadcancel").hide();
	}
	//缩略图上传成功回调
	function successImg(id){
		PostbirdImgGlass.init({
			domSelector : "#"+id+" img",
			animation : true,
			myDocument : window.parent.parent.parent
		});
	}
	//设置待删除附件的值到集合中
	function setRoadRFL(id,_this){
		layer.confirm('删除该图片？',{
			title:'警告',
			icon:0,
			shade:[0.1, '#fff']
		},function(){
			roadFuidList.push(id);
			//删除指定缩略图
			$("#"+id).remove();
			layer.close(layer.index);
		});
	}

	//显示图片删除按钮
	function imgRoadBtnShow(){
		//显示图片删除按钮 
		$("div.file-item span").show();
		//禁止点击上传按钮
		$("#roadworkForm div[id^='filePicker']").unbind("click").show();
	}
	
	
	//编辑按钮点击事件
	function roadworkEditForm(_this){
		layer.confirm('开启编辑状态？',{
			shade:[0.1, '#fff']
		},function(){
			//删除编辑按钮
			$(_this).remove();
			//添加保存按钮 重置按钮
			$("#roadworkSubmit").prepend($("#roadworkReset"));
			$("#roadworkSubmit").prepend($("#roadworkSave"));
			//开启编辑状态
			$("#roadworkForm input").attr("readonly",false);
			$("#roadworkForm select").attr("disabled",false);
			//上传按钮 启用
			$("#roadworkForm div[id^='filePicker']").unbind("click");
			imgRoadBtnShow();
			layer.close(layer.index);
		});
	}
	var opt;
	function roadworkSave1(_this){
		var t = $(_this).html();
		if(opt!=2){//如果是修改状态 就不涉及保存还是提交问题
			if(t=="保存"){
				opt=0;
			}else if(t=="提交"){
				opt=1;
			}
			//提交表单
			$("#roadworkForm").submit();
		}else{
			var approvalCount = ${approvalCount};
			if(approvalCount == 0 ){
				//提交表单
				$("#roadworkForm").submit();
			}else{
				layer.msg("此条数据已提交过审批，不能重复提交");
			}
		}
	}
	
	function initRoadWorkData(){
		var mli=layer.load(2);
		var roadworkId= $("#roadworkForm [name='roadworkId']").val();
		var roadwork_articleId=$("#roadwork_articleId").val();
		var unitName=$("input[name='unitName']").val();
		var unitCa=$("input[name='unitCa']").val();
		var remark = $("#rwRemark").val();
		if(roadWorkopt == "2"){
			if(remark == "" || remark == undefined){
				layer.msg("变更说明不能为空");
				layer.close(mli);
				return null;
			}
		}
		if($("#roadwork_s2").val()==""){
			layer.close(mli);
			layer.alert("请选择装修方案",{
				offset:'20%',
				shade:0.1
			});
			return null;
		}else{
			return {
				id:roadworkId,
				remark:remark,
				roadWorkopt:roadWorkopt,
				fkcustomerId:fkcustomerId,
				fkroomId:fkroomId,
				fkdschemeId:fkdschemeId,
				roadwork_articleId:"["+roadwork_articleId+"]",
				unitName:unitName,
				unitCa:unitCa,
				fIds:roadFuidList
			};
		}
		
	}
	function roadWorkSuccess(data,status){
	}
	//保存成功回调
	function dRoadSchemeDataSuccess(data, status) {
		layer.close(layer.index);
		if(data.msg){
			var i=layer.alert("操作成功",{
				offset:'20%',
				shade:0
			},function(){
				parent.location.reload();
				parent.parent.tabKey=1;
				parent.parent.tabToken=0;
				layer.close(i);
			});
		}
	}
		
	</script>
</div>
</body>
</html>